<template>
    <div>
        <h1>会员增加</h1>
        {{ abc.str }}
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">会员编号</td>
                    <td><input type="text" v-model="info.memberCode" disabled></td>
                </tr>
                <tr>
                    <td align="right">手机号</td>
                    <td><input type="text" v-model="info.tel" maxlength="11"></td>
                </tr>
                <tr>
                    <td align="right">姓名</td>
                    <td><input type="text" v-model="info.userName"></td>
                </tr>
                <tr>
                    <td align="right">证件类型</td>
                    <td>
                        <select v-model="info.cardType">
                            <option value="">请选择</option>
                            <option :value="item" v-for="item in arr">{{ item }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">证件号码</td>
                    <td><input type="text" v-model="info.card" maxlength="18"></td>
                </tr>
                <tr>
                    <td align="right">会员生日</td>
                    <td><input type="date" v-model="info.birthDay"></td>
                </tr>
                <tr>
                    <td align="right">会员积分</td>
                    <td><input type="text" v-model="info.score"></td>
                </tr>
                <tr>
                    <td align="right">会员余额</td>
                    <td><input type="text" v-model="info.money"></td>
                </tr>
                <tr>
                    <td align="right">会员等级</td>
                    <td>
                        <select v-model="info.levelId">
                            <option value="">请选择</option>
                            <option :value="item.id" v-for="item in lavelist">{{ item.levelName }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">会员性别</td>
                    <td>
                        <input type="radio" value="1" name="sex" v-model="info.gender">男
                        <input type="radio" value="0" name="sex" v-model="info.gender">女
                    </td>
                </tr>
                <tr>
                    <td align="right">会员爱好</td>
                    <td>
                        <input type="checkbox" name="likes" v-model="info.likes" value="吃">吃
                        <input type="checkbox" name="likes" v-model="info.likes" value="喝">喝
                        <input type="checkbox" name="likes" v-model="info.likes" value="嫖">嫖
                        <input type="checkbox" name="likes" v-model="info.likes" value="赌">赌
                        <input type="checkbox" name="likes" v-model="info.likes" value="抽">抽
                    </td>
                </tr>
                <tr>
                    <td align="right">会员简介</td>
                    <td>
                        <textarea rows="5" cols="50" v-model="info.desc"></textarea>
                    </td>
                </tr>
                <tr>
                    <td align="right">是否同意条款</td>
                    <td>
                        <input type="checkbox" v-model="info.isagree">XXX条款
                    </td>
                </tr>
                <tr>
                    <td align="right"></td>
                    <td>
                        <input type="button" value="确定" class="btn btn-success" @click="ok">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
import axios from 'axios';
import moment from 'moment';
import { useRouter } from 'vue-router';
const router = useRouter();
//导入
import { useUserStore } from '@/stores/User';
//创建store对象
const abc = useUserStore();
//声明一个变量,获取增加会员时所需的数据
let info: any = reactive({
    "memberCode": moment(new Date()).format('YYYYMMDD') + Math.random().toString().substr(3, 3),
    "tel": "",
    "userName": "",
    "card": "",
    "birthDay": "",
    "score": '',
    "money": '',
    "levelId": '',
    "gender": 1,
    "likes": [],
    "desc": "",
    "isagree": '',
    "state": '',
    "cardType": '',
})
let arr: any = ref(["身份证", "驾驶证", "军人证", "护照"]);

//获取会员等级
//onmouseenter 相当于文档就绪函数 生命周期钩子函数(12个)
onMounted(() => {
    //发送网络请求获取等级列表
    getLeveList();
})
//声明一个变量接收等级列表
let lavelist: any = ref([]);
//获取等级列表
const getLeveList = () => {
    axios({
        url: '/api/Members/GetMemberLevel',
        method: 'get',
    })
        .then((res) => {
            console.log(res);
            lavelist.value = res.data;
        })
        .catch((err) => {
            console.log(err);
        })
};
//做成会员增加
const ok = () => {
    //1.有效性判断
    if (info.tel == "") {
        alert('手机号不能为空');
        return;
    }
    let reg = /^1[3-9]\d{9}$/;
    if (reg.test(info.tel) == false) {
        alert('手机号不合法');
        return;
    }
    if (info.userName == "") {
        alert('姓名不能为空');
        return;
    }
    if (info.card == "") {
        alert('身份证号码不能为空');
        return;
    }
    let reg1 = /^\d{17}[0-9xX]$/;
    if (reg1.test(info.card) == false) {
        alert('身份证号码不合法');
        return;
    }
    if (info.birthDay == "") {
        alert('生日必填');
        return;
    }
    if (info.score == "") {
        alert('积分不能为空');
        return;
    }
    let reg2 = /^[+]?\d+$/;
    if (reg2.test(info.score) == false) {
        alert('积分只能是正数');
        return;
    }
    if (info.money == "") {
        alert('余额不能为空');
        return;
    }
    if (reg2.test(info.money) == false) {
        alert('余额只能是正数');
        return;
    }
    if (info.levelId == "") {
        alert('等级必选');
        return;
    }
    if (info.likes.length == 0) {
        alert('爱好必选');
        return;
    }
    if (info.desc == "") {
        alert('简介不能为空');
        return;
    }
    let reg3 = /^[\u4e00-\u9fa5](1,50)$/;
    if (reg3.test(info.desc) == true) {
        alert('只能是50以内的汉字');
        return;
    }
    if (info.isagree == false) {
        alert('同意条款必选');
        return;
    }
    //2.做增加操作
    info.likes = info.likes.toString();
    axios({
        url: '/api/Members/AddMeMber',
        method: 'post',
        data: info,
    })
        .then((res) => {
            console.log(res);
            if (res.data > 0) {
                alert('增加成功');
                //跳转到会员列表
                router.push("/memberList");
                return;
            }
            if (res.data == -1) {
                alert('手机号重复');
                return;
            }
            else {
                alert('增加失败');
                return
            }
        })
        .catch((err) => {
            console.log(err);
        });
}
</script>

<style scoped></style>